<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>角色管理</title>
<%@include file="/jsp/common/inc.jsp"%>
<script type="text/javascript">
	var grid;// 角色信息列表
	$(function() {
		grid = $("#grid").datagrid({
			url : "${pageContext.request.contextPath}/roleController/datagrid",
			striped : true,
			rownumbers : true,
			pagination : true,
			singleSelect : true,
			fitColumns : true,
			idField : "id",
			pagesize : 10,
			pageList : [10,20,30],
			toolbar : "#toolbar",
			columns : [ [ {
				width : 100,
				title : "角色名称",
				field : "name"
			}, {
				width : 100,
				title : "描述",
				field : "description"
			}, {
				width : 100,
				title : "排序",
				field : "seq"
			},{
				width : 100,
				title : "创建时间",
				field : "createTime"
			}, {
				width : 100,
				title : "操作",
				field : "action",
				formatter : function(value,rowData,rowIndex) {
					var str = "<button onclick='showFun(" + rowIndex + ")'>查看</buttion>";
					str +=  "<button onclick='editFun(" + rowIndex + ")'>编辑</buttion>";
					str +=  "<button onclick='grantResource(" + rowIndex + ")'>授权</buttion>";
					str +=  "<button onclick='deleteFun(" + rowIndex + ")'>删除</buttion>";
					return str;
				}
			} ] ]

		});
	});
	function searchFun(){
		grid.datagrid("load",sy.serializeObject($("#role_form")));
	}
	function showFun(){
		
	}
	function editFun(){
		
	}
	//增加角色
	var addFun = function(){
		var dialog = parent.sy.modalDialog({
			title : "增加角色",
			url : "${pageContext.request.contextPath}/roleController/add",
			buttons : [{
				text : "添加",
				handler : function(){
					dialog.find('iframe').get(0).contentWindow.submitForm(dialog, grid, parent.$);
				}
			}]
		})
	};
	
	// 显示角色授权弹出框
	function grantResource(rowIndex){
		var row = grid.datagrid("getRows")[rowIndex];
		$("#grant_resource").window("open");
		$('#roleId').val(row.id);
		$('#roleName').val(row.name);
	   	$('#tree').tree({  
	    	fit : true,
			checkbox : true,
		    url:'${pageContext.request.contextPath}/roleController/getResource', 
		    parentField : 'pid',
		    queryParams:{roleId:row.id},
			cascadeCheck:false
			});
	}
	// 保存授权信息
	function addResourceRole(){
		var roleId = $("#roleId").val();
		// 获取选中的节点的id
		var nodes = $("#tree").tree("getChecked");
		var resIds = "";
		for(var i = 0; i < nodes.length; i++){
			if(resIds != ""){
				resIds+= ",";
			}
			resIds += nodes[i].id;
		}
		$.post("${pageContext.request.contextPath}/roleController/addResourceRole",{"roleId":roleId,"resIds":resIds},
				function(result){
			if(result.success){
				$.messager.alert('提示','分配资源成功！','info');
			}else{
				$.messager.alert('提示', result.msg, 'error');
			}
		});
		$('#grant_resource').window('close');
		$('#grid').datagrid('reload');
	}
</script>
</head>
<body class="easyui-layout" data-options="fit:true,border:false">
	<div id="toolbar" style="display: none;">
		<form id="role_form">
			<table>
				<tr>
					<td>角色名称</td>
					<td>
						<input id="name" name="name" maxlength="20" 
							class="easyui-textbox" style="width:150px"/>
					</td>
					<td><a href="#" class="easyui-linkbutton" onclick="searchFun()">查询</a></td>
					<td><a href="#" class="easyui-linkbutton" onclick="clearFun()">清空</a></td>
				</tr>
				<tr>
					<td><a class="easyui-linkbutton" href="#" onclick="addFun()">增加</a></td>
				</tr>
			</table>
		</form>

	</div>
	<div data-options="region:'center',fit:true,border:false">
		<table id="grid" data-options="fit:true,border:false"></table>
	</div>

	<!-- 权限分配窗口 -->
	<div id="grant_resource" class="easyui-window" title="资源分配" 
	data-options="modal:true,closed:true,collapsible:false,minimizable:false" 
	style="width: 350px; height: 400px; padding: 10px;">
	<div class="easyui-layout" data-options="fit:true">
		<div data-options="region:'center'" 
			style="width: 150px; padding: 1px;">
			
			<form id="form" method="post">
				<input id="roleId" name="id" type="hidden">
				角色名称:<input id="roleName" name="name" type="text" style="width: 80px;" readonly="readonly">
				&nbsp;&nbsp;<a href="javascript:void(0)">角色名称不可编辑</a>
				<br/>
				<ul id="tree" class="easyui-tree"></ul>
			</form>
		</div>
		<div data-options="region:'south',border:false"
				style="text-align: right; padding: 5px 0 0;">
				<a href="javascript:void(0)" class="easyui-linkbutton"
					onclick="addResourceRole()" data-options="iconCls:'icon-ok'">保存
				</a> <a href="javascript:void(0)" class="easyui-linkbutton"
					data-options="iconCls:'icon-no'"
					onclick="$('#grant_resource').window('close')">关闭</a>
		</div>

		</div>
	
	</div>

</body>
</html>